<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="utf-8" />

  <!-- For old IEs -->
  <link rel="shortcut icon" href="%PUBLIC_URL%/favicon/favicon.ico" />

  <!-- For new browsers - multisize ico  -->
  <link rel="icon" type="image/x-icon" sizes="16x16 32x32" href="%PUBLIC_URL%/favicon/favicon.ico">

  <!-- For iPad with high-resolution Retina display running iOS ≥ 7: -->
  <link rel="apple-touch-icon" sizes="152x152" href="%PUBLIC_URL%/favicon/favicon-152-precomposed.png">

  <!-- For iPad with high-resolution Retina display running iOS ≤ 6: -->
  <link rel="apple-touch-icon" sizes="144x144" href="%PUBLIC_URL%/favicon/favicon-144-precomposed.png">

  <!-- For iPhone with high-resolution Retina display running iOS ≥ 7: -->
  <link rel="apple-touch-icon" sizes="120x120" href="%PUBLIC_URL%/favicon/favicon-120-precomposed.png">

  <!-- For iPhone with high-resolution Retina display running iOS ≤ 6: -->
  <link rel="apple-touch-icon" sizes="114x114" href="%PUBLIC_URL%/favicon/favicon-114-precomposed.png">

  <!-- For iPhone 6+ -->
  <link rel="apple-touch-icon" sizes="180x180" href="%PUBLIC_URL%/favicon/favicon-180-precomposed.png">

  <!-- For first- and second-generation iPad: -->
  <link rel="apple-touch-icon" sizes="72x72" href="%PUBLIC_URL%/favicon/favicon-72-precomposed.png">

  <!-- For non-Retina iPhone, iPod Touch, and Android 2.1+ devices: -->
  <link rel="apple-touch-icon" sizes="57x57" href="%PUBLIC_URL%/favicon/favicon-57.png">

  <!-- For Old Chrome -->
  <link rel="icon" sizes="32x32" href="%PUBLIC_URL%/favicon/favicon-32.png">

  <!-- For IE10 Metro -->
  <meta name="msapplication-TileColor" content="#FFFFFF">
  <meta name="msapplication-TileImage" content="%PUBLIC_URL%/favicon/favicon-144.png">
  <meta name="theme-color" content="#f6f7f9">

  <!-- Chrome for Android -->
  <link rel="icon" sizes="192x192" href="%PUBLIC_URL%/favicon/favicon-192.png">

  <meta name="viewport" content="width=device-width, initial-scale=1" />
  <meta name="keywords" content="前端导航,Hello Nav">
  <meta name="description" content="A navigation for developer" />
  <link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
  <title>Hello Nav!</title>
  <style>
    .skip-link {
      position: absolute;
      top: -100px;
      left: 0;
      background: #000000;
      color: white;
      padding: 8px;
      z-index: 100;
    }

    .skip-link:focus {
      top: 0;
    }
  </style>
  <script>
    if (document.documentElement) {
      var themeClassName = window.localStorage && window.localStorage.__THEME__ || 'none'
      document.documentElement.className = themeClassName
      if (themeClassName === 'theme--dark') {
        document.querySelector('meta[name="theme-color"]').setAttribute('content', 'rgba(45, 46, 48, 0.9)')
      }
    }
  </script>
</head>

<body>
  <noscript>You need to enable JavaScript to run this app.</noscript>
  <a class="skip-link" href="#root">Skip to main</a>
  <div id="root"></div>
  <h1 style="color: transparent">Hello Nav</h1>
</body>

</html>